﻿<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>超市账单管理系统</title>
    <link rel="stylesheet" href="css/public.css"/>
    <link rel="stylesheet" href="css/style.css"/>
</head>
<body>
<!--头部-->
<header class="publicHeader">
    <h1>超市账单管理系统</h1>
    <div class="publicHeaderR">
        <p><span>下午好！</span><span style="color: #fff21b"> Admin</span> , 欢迎你！</p>
        <a href="login.html">退出</a>
    </div>
</header>
<!--时间-->
<section class="publicTime">
    <span id="time">2015年1月1日 11:11  星期一</span>
    <a href="#">温馨提示：为了能正常浏览，请使用高版本浏览器！（IE10+）</a>
</section>
<!--主体内容-->
<section class="publicMian ">
    <div class="left">
        <h2 class="leftH2"><span class="span1"></span>功能列表 <span></span></h2>
        <nav>
            <ul class="list">
                <li><a href="billList.html">账单管理</a></li>
                <li><a href="providerList.html">供应商管理</a></li>
                <li><a href="userList.html">用户管理</a></li>
                <li id="active"><a href="password.html">密码修改</a></li>
                <li><a href="login.html">退出系统</a></li>
            </ul>
        </nav>
    </div>
    <div class="right">
        <div class="location">
            <strong>你现在所在的位置是:</strong>
            <span>密码修改页面</span>
        </div>
        <div class="providerAdd">
            <form action="updatePassword" method="post">
                <!--div的class 为error是验证错误，ok是验证成功-->
                <div class="">
                    <label>旧密码：</label>
                    <!--                        onblur 失去焦点的回调-->
                    <input type="password" name="password" id="old_Password" onblur="checkPassword()" required/>
                    <span id="error" style="color: red"></span>
                </div>
                <div>
                    <label for="newPassword">新密码：</label>
                    <input type="password" name="newPassword" id="newPassword" onblur="checkNewPassword1()"  required/>
                    <span id="newPassworInfo1" style="color: red"></span>
                </div>
                <div>
                    <label for="reNewPassword">确认新密码：</label>
                    <input type="password" name="reNewPassword" id="reNewPassword" onblur="checkNewPassword2()"
                           required/>
                    <span id="newPassworInfo2" style="color: red"></span>
                </div>
                <div class="providerAddBtn">
                    <!--<a href="#">保存</a>-->
                    <input type="submit" value="保存" />
                </div>
            </form>
        </div>
    </div>
</section>
<footer class="footer">
</footer>
<script src="js/time.js"></script>
<script src="js/jquery.js"></script>
<script language="JavaScript">

    function checkNewPassword1() {
        if(!$("#newPassword").val())
        {
            $("#newPassworInfo1").text("*请输入新密码");
        }
        else {
            $("#newPassworInfo1").text("");
        }
    }


    function checkNewPassword2() {

        if ($("#newPassword").val() != $("#reNewPassword").val()) {
            $("#newPassworInfo2").text("*请输入新确认密码，保证和新密码一致");
        } else {
            $("#newPassworInfo2").text("");

        }
    }


    // 检查旧密码是不是正确


    function checkPassword() {
        //取得旧密码的值
        let pasval = $("#old_Password").val();
        console.log(pasval)
        $.ajax({
            url: "/checkPassword",
            data: {"password": pasval},
            type: "get",
            //成功后的回调
            success: function (r) {
                if (!r) {
                    $("#error").text("原密码输入错误");
                    $("#error").focus();
                } else {
                    $("#error").text("");
                }
            }

        })

    }

</script>

</body>
</html>